//电桩
// 调用充电状态接口
$(function() {
    
    $.ajax({
        url: "/cms/getBigScreenByChargerId" + location.search,
        type: "get",

        // jsonpCallback: "jsonpCallback",
        success: function(data) {
            function userAccount() {
                function formatId(id) {
                    return id.replace(/(\d{3})\d{9}(\d{4})/, "$1****$2");
                }

                //转换json对象为jquery对象
                var obj = $.parseJSON(data);
                //遍历数组获取单个对象
                // console.log(data);
                alternates = obj.pojo.stateList;
                //将数字加密


                $.each(alternates, function(i, item) {
                    var cardId = formatId(item.user_pay_card);
                    var dcState = $('#port' + item.port_no);
                    var gun = $('#gun' + item.port_no);
                    item.soc = 60;
                    var soc = item.soc;
                    var charger_kwh = item.charger_kwh;
                    var remaining_time = item.remaining_time;
                    var battery_temperature = item.battery_temperature;
                    if (item.charge_status == 0) {
                        gun.css('background-image','url(./img/trianglegreen.png )');
                        dcState.html('<div class="picB"><img class="chargeingType" id="pic-img" src="img/free-1.png"></div><div class="chargeingType">空闲中...</div><ul class="currentInfo"><li><ul><li>已充电量</li><li>_</li></ul></li><li><ul><li>预计剩余时间</li><li>_</li></ul></li><li><ul><li>电池温度</li><li>_</li></ul></li></ul>');
                        $('.picB').css('padding-top', '353px');
                        $('#pic-img').css('padding-bottom','0');
                    } else if (item.charge_status == 1) {
                        gun.css('background-image','url(./img/triangle.png)');
                        dcState.html('<div class="picB"><img id="circle2" src="img/dc-b.png" /><img class="userpic" src="img/user.png" /></div><div class="chargeingType">已被用户<span id="u_id">' + cardId + '</span>预约</div><ul class="currentInfo"><li><ul><li>已充电量</li><li>_</li></ul></li><li><ul><li>预计剩余时间</li><li>_</li></ul></li><li><ul><li>电池温度</li><li>_</li></ul></li></ul>');
                        $('.picB').css('padding-top', '287px');
                    } else if (item.charge_status == 2) {
                        gun.css('background-image','url(./img/triangleblue.png )');
                                   if(soc == 0 || soc == null){
                                    
                                    $('#circle2').circleProgress({
                                    value: 0/100,
                                    startAngle:-1.5,
                                    size:700,
                                    emptyFill: 'rgba(0, 0, 0, .3)',
                                }).on('circle-animation-progress', function(event, progress) {
                                    $(this).find('strong').html(parseInt(0 * progress) + '%');
                                    });
                                    $('#circlehidden').circleProgress({
                                    value: 0/100,
                                    startAngle:-1.5,
                                    size:750,
                                    animationStartValue: 0,
                                    emptyFill: '#343738',
                                    fill: { color: 'rgba(255, 255, 255, .0)' }
                                    }).on('circle-animation-progress', function(event, progress) {
                                    $(this).find('strong').html(parseInt(0 * progress) + '%');
                                });
                                $('.display').css('display','block');
                            }else if(soc <= 33 && soc > 0){
                                dcState.html('<div class="picA"><div class="bigcircle"><div id="circle2" class="second circle second anim-flip show"> <strong></strong><img class="pic" src="img/circle1.png" /><img class="battery" src="img/batteryM1.png" /></div><div id="circlehidden"></div></div></div><div class="chargeingType">用户'+ cardId +'充电中...</div><ul class="currentInfo"><li><ul><li>已充电量</li><li><span>'+charger_kwh+'</span>度</li></ul></li><li><ul><li>预计剩余时间</li><li><span id="remaining_time">'+remaining_time+'</span>分钟</li></ul></li><li><ul><li>电池温度</li><li><span id="battery_temperature">'+battery_temperature+'</span>°C</li></ul></li></ul>');
                                $('.currentInfo').css('color','#fff');
                            }else if(soc>33 && soc<=66){
                                dcState.html('<div class="picA"><div class="bigcircle"><div id="circle2" class="second circle second anim-flip show"> <strong></strong><img class="pic" src="img/circle1.png" /><img class="battery" src="img/batteryM2.png" /></div><div id="circlehidden"></div></div></div><div class="chargeingType">用户'+ cardId +'充电中...</div><ul class="currentInfo"><li><ul><li>已充电量</li><li><span>'+charger_kwh+'</span>度</li></ul></li><li><ul><li>预计剩余时间</li><li><span id="remaining_time">'+remaining_time+'</span>分钟</li></ul></li><li><ul><li>电池温度</li><li><span id="battery_temperature">'+battery_temperature+'</span>°C</li></ul></li></ul>');
                            }else if(soc > 66 && soc < 100){
                                dcState.html('<div class="picA"><div class="bigcircle"><div id="circle2" class="second circle second anim-flip show"> <strong></strong><img class="pic" src="img/circle1.png" /><img class="battery" src="img/batteryM3.png" /></div><div id="circlehidden"></div></div></div><div class="chargeingType">用户'+ cardId +'充电中...</div><ul class="currentInfo"><li><ul><li>已充电量</li><li><span>'+charger_kwh+'</span>度</li></ul></li><li><ul><li>预计剩余时间</li><li><span id="remaining_time">'+remaining_time+'</span>分钟</li></ul></li><li><ul><li>电池温度</li><li><span id="battery_temperature">'+battery_temperature+'</span>°C</li></ul></li></ul>');
                            }else if(soc == 100){
                                    dcState.html('<div class="picA"><div class="bigcircle"><div id="circle2" class="second circle second anim-flip show"> <strong></strong><img class="pic" src="img/circle1.png" /><img class="battery" src="img/batteryM4.png" /></div><div id="circlehidden"></div></div></div><div class="chargeingType">用户'+ cardId +'已充满...</div><ul class="currentInfo"><li><ul><li>已充电量</li><li><span>'+charger_kwh+'</span>度</li></ul></li><li><ul><li>预计剩余时间</li><li><span id="remaining_time">'+remaining_time+'</span>分钟</li></ul></li><li><ul><li>电池温度</li><li><span id="battery_temperature">'+battery_temperature+'</span>°C</li></ul></li></ul>');
                            }
                        var round = $('#circle2');
                        var round_small = $('#circlehidden');
                            round.circleProgress({
                                value: soc / 100,
                                startAngle: -1.5,
                                size: 700,
                                emptyFill: 'rgba(0, 0, 0, .3)',
                            }).on('circle-animation-progress', function(event, progress) {
                                $(this).find('strong').html(parseInt(soc * progress) + '%');
                            });
                        round_small.circleProgress({
                        value: soc/100,
                        startAngle:-1.5,
                        size:750,
                        animationStartValue: 0,
                        emptyFill: '#343738',
                        fill: { color: 'rgba(255, 255, 255, .0)' }
                        }).on('circle-animation-progress', function(event, progress) {
                        $(this).find('strong').html(parseInt(soc * progress) + '%');
                    });
                    }

                });
                // $(document).ready(function () {
                // setInterval("Refresh()",5000);
                // });
            }
            userAccount();
            // setInterval(userAccount,10*6000);


            function weather() {
                var dataList = $.parseJSON(data);
                $.each(dataList, function(i, item) {
                    
                        console.log(item.weather);
                        $('#weather').html(item.weather);
                        $('#city_temperature').html(item.city_temperature);
                        $('#pm_level').html(item.pm_level);
                        $('#pm25').html(item.pm25);
                        if (item.pm25 <= 35) {
                            $('.Airquality').css('background', '#84df33');
                        } else if (item.pm25 > 35 && item.pm25 <= 53) {
                            $('.Airquality').css('background', '#f09e4e');
                        } else if (item.pm25 > 54 && item.pm25 <= 70) {
                            $('.Airquality').css('background', '#f17c73');
                        } else if (item.pm25 > 70) {
                            $('.Airquality').css('background', '#ce30ff');
                        }
                    

                });
            }

            // userRound();
            weather(); 

        },
        error: function(responseText, textStatus, XMLHttpRequest) {
            $('.display').css('display','block');
        }

    });

});